// 柱状图模块1
(function() {
  //  1实例化对象
  var myChart = echarts.init(document.querySelector(".bar .chart"));
  // 2 指定配置项和数据
  var option = {
      
      tooltip: {
        trigger: 'axis',
        axisPointer: {
          type: 'cross',
          crossStyle: {
            color: '#999'
          }
        }
      },
      legend: {
        data: ['运营线路条数', '运营线路长度'],
        textStyle: {
            color:"rgba(255,255,255,.6)"
        }
      },
      xAxis: [
        {
          type: 'category',
          data: ['杭州', '宁波', '温州', '嘉兴', '湖州', '绍兴', '金华', '衢州', '舟山', '台州', '丽水'],
          axisPointer: {
            type: 'shadow'
          },
          axisLabel:{
              color:"rgba(255,255,255,.6)",
              fontSize: '12'
          },
          axisLine:{
              show: false
          }
        }
      ],
      yAxis: [
         {
          type: 'value',
          name: '条',
          min: 0,
          max: 1400,
          interval: 200,
          axisLabel:{
              color:"rgba(255,255,255,.6)",
              fontSize: '12'
          },
          axisLine:{
              lineStyle:{
                  color:"rgba(255,255,255,.1)",
              }
          },
          splitLine:{
              lineStyle:{
                  color:"rgba(255,255,255,.1)",
              }
          }
        },
        {
          type: 'value',
          name: '万公里',
          min: 0,
          max: 2.5,
          interval: 0.5,
          axisLabel:{
              color:"rgba(255,255,255,.6)",
              fontSize: '12'
          },
          axisLine:{
              lineStyle:{
                  color:"rgba(255,255,255,.1)",
              }
          },
          splitLine:{
              show:false,

          }
        }
      ],
      series: [
        {
          name: '运营线路条',
          type: 'bar',
          barWidth:"35%",
          itemStyle:{
              normal:{
                  barBorderRadius: 5,
                  color: new echarts.graphic.LinearGradient(0,0,0,1,[{offset: 1,color: '#33cabb'},{offset: 0,color: '#3EACE5'}])
                  // color:"#2f89cf",
              },
          },
          data: [
            1118, 1175, 671, 551, 400, 677, 899, 131, 155, 467, 148
          ]
        },
        {
          name: '运营线路长度',
          type: 'line',
          lineStyle:{
              normal:{
                  color:"#99cc00",
              },
          },
          yAxisIndex: 1,
          data: [2.0, 2.2, 1.4, 1.0,0.8,1.0, 1.6, 0.2, 0.3, 1.0, 0.2]
        }
      ]
  };
  // 3 配置项给实例对象
  myChart.setOption(option);
  // 4 让图表跟随屏幕自动的去适应
  window.addEventListener('resize',function() {
      myChart.resize();
  });
})();
// 柱状图2
(function() {
  var myChart = echarts.init(document.querySelector(".line .chart"));
    var option = {
        tooltip: {
          trigger: 'axis',
          axisPointer: {
            type: 'cross',
            crossStyle: {
              color: '#999'
            }
          }
        },
        legend: {
          data: ['客运量', '增速'],
          textStyle: {
            color:"rgba(255,255,255,.6)"
        }
        },
        xAxis: [
          {
            type: 'category',
            data: ['2017年', '2018年', '2019年', '2020年', '2021年'],
            axisPointer: {
              type: 'shadow'
            },
            axisPointer: {
                type: 'shadow'
              },
              axisLabel:{
                  color:"rgba(255,255,255,.6)",
                  fontSize: '12'
              },
              axisLine:{
                  show: false
              }
          }
        ],
        yAxis: [
           {
            type: 'value',
            name: '亿人次',
            min: 32.5,
            max: 35.5,
            interval: 0.5,
            axisLabel:{
                color:"rgba(255,255,255,.6)",
                fontSize: '12'
            },
            axisLine:{
                lineStyle:{
                    color:"rgba(255,255,255,.1)",
                }
            },
            splitLine:{
                lineStyle:{
                    color:"rgba(255,255,255,.1)",
                }
            }
          },
          {
            type: 'value',
            name: '%',
            min: -4.0,
            max: 3.0,
            interval: 1.0,
            axisLabel:{
                color:"rgba(255,255,255,.6)",
                fontSize: '12'
            },
            axisLine:{
                lineStyle:{
                    color:"rgba(255,255,255,.1)",
                }
            },
            splitLine:{
                show:false,

            }
          }
        ],
        series: [
          {
            name: '客运量',
            type: 'bar',
            barWidth:"50%",
            itemStyle:{
                normal:{
                    barBorderRadius: 5,
                    color: new echarts.graphic.LinearGradient(0,0,0,1,[{offset: 1,color: '#33cabb'},{offset: 0,color: '#3EACE5'}])
                    // color:"#2f89cf",
                },
            },
            data: [
              35, 33.89, 33.79,33.45, 33.48
            ]
          },
          {
            name: '增速',
            type: 'line',
            yAxisIndex: 1,
            lineStyle:{
                normal:{
                    color:"#99cc00",
                },
            },
            data: [1.9, -3.0, -0.3, -1.0,0.1]
          }
        ]
      };
    // 3 配置项给实例对象
    myChart.setOption(option);
    // 4 让图表跟随屏幕自动的去适应
    window.addEventListener('resize',function() {
        myChart.resize();
    });
})();
// 模拟飞行路线模块地图模块
(function() {
  var myChart = echarts.init(document.querySelector(".map .chart"));
  $.get('zhejiang.json',function(geoMap) {
    console.log(ret)
    echarts.registerMap('../JSON/zhejiang.json',geoMap)
    var option = {
      geo: {
        type:'map',
        map:'zhejiang'
      }
    }
    myChart.setOption(option);
  // 监听浏览器缩放，图表对象调用缩放resize函数
    window.addEventListener("resize", function() {
    myChart.resize();
    })
  })
})();
